<template>
  <div>
    <el-card>
      <el-form ref="form" :model="formData" size="medium" label-width="110px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="监督机构" prop="orgName">
              <el-select
                v-model="formData.orgId"
                multiple
                collapse-tags
                style="margin-left: 20px;"
                placeholder="请选择">
                <!--              <el-input v-model="formData.orgName" clearable :style="{width: '90%'}"></el-input>-->
                <!--              <el-select v-model="formData.orgId" filterable placeholder="请选择">-->
                <el-option :key="orgid" label="全部" :value="orgid">
                </el-option>
                <el-option
                  v-for="item in forname"
                  :key="item.id"
                  :label="item.orgName"
                  :value="item.id">
                </el-option>
              </el-select>

            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="年份" prop="yearly">
              <!--              <el-input v-model="formData.yearly" clearable :style="{width: '50%'}"></el-input>-->
              <!--              <el-date-picker v-model="formData.yearly" format="yyyy" value-format="yyyy"-->
              <!--                              :style="{width: '50%'}" clearable ></el-date-picker>-->
              <el-date-picker v-model="formData.yearly" type="year" placeholder="选择年" format="yyyy" value-format="yyyy"
                              :style="{width: '50%'}" clearable></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-button type="success" @click="inquire">检索</el-button>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-card class="box-card">
      <el-table :data="orginfolist"
                border style="width:100%; font-size: 5px">
        <el-table-column
          fixed
          prop="orgName"
          label="单位"
          width="160">
        </el-table-column>
        <el-table-column
          prop="zbbdocDate"
          label="编办批文日期"
          width="100">
        </el-table-column>
        <el-table-column
          prop="listingDate"
          label="挂牌日期"
          width="100">
        </el-table-column>
        <el-table-column
          prop="standaloneDate"
          label="独立运行日期"
          width="100">
        </el-table-column>
        <el-table-column
          prop="orgLevel"
          label="行政级别"
          width="60">
        </el-table-column>
        <el-table-column
          prop="orgPro"
          label="行政性质"
          width="60">
        </el-table-column>
        <el-table-column
          prop="zbbNum"
          label="编制人数"
          width="60">
        </el-table-column>
        <el-table-column
          prop="ifPublicmanage"
          label="是否参公管理"
          width="60">
        </el-table-column>
        <el-table-column
          prop="onworkerNum"
          label="在职人数"
          width="60">
        </el-table-column>
        <el-table-column
          prop="retireNum"
          label="离退休人数"
          width="60">
        </el-table-column>
        <el-table-column label="办公用房">
          <el-table-column
            prop="officeBuildarea"
            label="建筑面积（平方米）"
            width="70">
          </el-table-column>
          <el-table-column
            prop="buildingOwnership"
            label="房屋所有权"
            width="70">
          </el-table-column>
          <el-table-column
            prop="officeBuildingarea"
            label="在建面积（平方米）"
            width="70">
          </el-table-column>
        </el-table-column>
        <el-table-column label="内设科室数">
          <el-table-column
            prop="businessDivCount"
            label="业务科室"
            width="62">
          </el-table-column>
          <el-table-column
            prop="funDivCount"
            label="职能科室数"
            width="70">
          </el-table-column>
          <el-table-column
            prop="orgCount"
            label="派出机构数"
            width="70">
          </el-table-column>
        </el-table-column>
      </el-table>
      <el-row type="flex" justify="center" class="page-row" v-show="page_show">
        <el-pagination
          background
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage"
          :page-size="pagesize"
          layout="total, prev, pager, next, jumper"
          :total="total">
        </el-pagination>
      </el-row>
    </el-card>
  </div>
</template>

<script>
  import {post} from "@/utils/api";

  export default {
    data() {
      return {
        orginfolist:[],
        currentPage:1,
        total:0  ,//一共有多少条数据
        pagesize:6, //每页显示多少条数据  页数等于  total/pagesize
        moneylist:[],
        page_show:true,
        formData:{},
        forname:[],
        orgid:0
      }
    },
    async created() {
      let res = await post("org/getallorg")
      this.forname = res
      this.getListByPage(1)
      // console.log(res);
    },
    methods:{
      async inquire(){
        console.log(this.formData)
        let res = await post("org/getorgnameandyearly",{...this.formData})
        // console.log(res);
        let o = [res]
        this.orginfolist = o
        this.page_show = false
        console.log(this.orginfolist)
        // this.total = res.total
        // console.log(res.total)
        this.formData = {}
      },
      async getListByPage(page){
        let res = await post("org/getorgandorgplus",{page: page, count: this.pagesize})
        console.log(res)
        //处理信息
        this.page_show = true
        this.orginfolist = res.records
        console.log(this.orginfolist)
        this.total = res.total
        console.log(res.total)

      },
      handleCurrentChange(currentPage){
        //当前页码改变时触发
        // console.log(currentPage)
        this.currentPage = currentPage
        this.getListByPage(currentPage)
      },
    }
  }
</script>
<style></style>
